<template>
    <div>
      <h1>会员详情页</h1>
      <a href="/show">返回</a>
      
      <table class="table">
             <tbody>
                <tr>
                <td>会员编号</td>
                <td>{{data.id}}</td>
                </tr>
                <tr>
                <td>会员姓名</td>
                <td>{{data.name}}</td>
            </tr>
                <tr>
                <td>会员性别</td>
                <td>{{data.sex==1?'男':'女'}}</td>
            </tr>
                <tr>
                <td>会员年龄</td>
                <td>{{data.age}}</td>
            </tr>
                <tr>
                <td>会员生日</td>
                <td>{{data.memberDate}}</td>
            </tr>
                <tr>
                <td>状态</td>
                <td>{{data.state?'启用':'禁用'}}</td>
            </tr>
                <tr>
                <td>爱好数量</td>
                <td>{{data.houbbyCount}}</td>
            </tr>   
                <tr>
                <td>爱好</td>
                <td>{{data.houbbyString}}</td>
            </tr>
                <tr>
                <td>会员等级</td>
                <td>{{data.memberLevelId}}</td>
            </tr>
             </tbody>
      </table>
    </div>
</template>

<script setup lang="ts">
import {ref,onMounted} from 'vue'
import axios from 'axios'
import { useRouter,useRoute } from 'vue-router'
import moment from 'moment'

const router=useRouter();
const route=useRoute();
onMounted(()=>{
    fantian();
}) 
const h=ref([])

const data = ref({
    "id": 3,
  "name": "李四",
  "sex": 2,
  "age": "12",
  "memberDate": "2025-04-16T00:00:00",
  "state": true,
  "isDeleted": true,
  "houbbyCount": 3,
  "houbbyString": "画画,篮球,羽毛球",
  "memberLevelId": 2
  })


const fantian=()=>{
   var vid = route.query.id;
   axios.get("https://localhost:7048/api/Member/Getid",{params:{id:vid}}).then(res=>{
      data.value=res.data
    h.value =data.value.houbbyString.split(',')
   data.value.memberDate=moment(data.value.memberDate).format("YYYY-MM-DD")

   })
}

</script>

<style scoped>

</style>
